<template>
  <el-form  ref="ruleFormRef" :model="formInline" :rules="formRules" label-width="auto" label-position="top" v-loading="isLoading">
    <el-row :gutter="30">
		<re-col :value='24' :xs='24' :sm='24'>
				<el-form-item :label='titles?.drawingName' prop='drawingName'>
					<el-input :maxlength="30" :show-word-limit="true" v-model.trim='formInline.drawingName' clearable :placeholder='prompt?.drawingName' />
				</el-form-item>
			</re-col>
			<re-col :value='24' :xs='24' :sm='24'>
				<el-form-item :label='titles?.showMode' prop='showMode'>
					<el-radio-group v-model='formInline.showMode'>
							<el-radio v-for="item in SHOWMODE_TYPE" :key="item.value" :value="item.value">
								{{ isNullOrEmpty( item.label ) }}
							</el-radio>
						</el-radio-group>
					<!-- <el-input v-model.trim='formInline.showMode' clearable :placeholder='prompt?.showMode' /> -->
				</el-form-item>
			</re-col>
			<re-col :value='24' :xs='24' :sm='24'>
				<el-form-item :label='titles?.img' prop='img'>
					<ReUpload v-model:files='formInline.img' :limit="1"></ReUpload>
					<!-- <el-input v-model.trim='formInline.img' clearable :placeholder='prompt?.img' /> -->
				</el-form-item>
			</re-col>

			<re-col :value='24' :xs='24' :sm='24'>
				<el-form-item :label='titles?.VR' prop='VR'>
					<el-input v-model.trim='formInline.VR' clearable :placeholder='prompt?.VR' />
				</el-form-item>
			</re-col>
			<re-col :value='24' :xs='24' :sm='24'>
				<el-form-item :label='titles?.topoId' prop='topoId'>
					<!-- <el-input v-model.trim='formInline.TopId' clearable :placeholder='prompt?.TopId' /> -->
					<configurationSelect v-model='formInline.topoId' clearable placeholder='请选择组态' :style='{ width: "100%" }' @blur="formValidateField(ruleFormRef, 'topoId')"></configurationSelect>
				</el-form-item>
			</re-col>

			
			<re-col :value='24' :xs='24' :sm='24'>
				<el-form-item :label='titles?.isDefault' prop='isDefault'>
					<!-- <el-input v-model.trim='formInline.isDefault' clearable :placeholder='prompt?.isDefault' /> -->
					<el-radio-group v-model='formInline.isDefault'>
							<el-radio v-for="item in ISDEFAULT_TYPE" :key="item.value" :value="item.value">
								{{ isNullOrEmpty( item.label ) }}
							</el-radio>
						</el-radio-group>
				</el-form-item>
			</re-col>
			
			
			
			   </el-row>
  </el-form>
</template>

<script setup lang="ts">
import { isNullOrEmpty } from '@/utils/functions'
import { SHOWMODE_TYPE,ISDEFAULT_TYPE } from '@/constant/drawing-management';
import ReUpload from '@/components/ReUpload/index.vue'
import { ref,reactive } from "vue";
import ReCol from "@/components/ReCol";
import type { FormRules } from "element-plus";
import { titles,prompt } from './index';
import configurationSelect from '@/components/select/configuration/ConfigurationSelect/ConfigurationSelect.vue'
import type { infoType } from '@/api/operate/project-management/project-management/drawing-management/index';
import { formValidateField } from '@/utils/functions'
type FormProps = {
	formInline: infoType,
	isLoading: boolean
}

const props = withDefaults(defineProps<FormProps>(), {
	formInline: () => ({} as infoType),
	isLoading: false
});
console.log('数据',props);

const formRules = reactive(<FormRules>{
drawingName: [{ required: true, message: prompt?.drawingName, trigger: 'blur' },],

});
const ruleFormRef = ref();
//    const newFormInline = ref(props.formInline as any);
//
//
//    watch(()=>props.formInline,()=>{
//    	newFormInline.value = props.formInline
//    },{
//    	deep:true,
//    	immediate:true
//    })
function getRef() {
  return ruleFormRef.value;
}

defineExpose({ getRef });
</script>
